<template>
   <div class="app-container">
      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
         <el-form-item label="物品名称" prop="productsName">
            <el-input
               v-model="queryParams.productsName"
               placeholder="请输入物品名称"
               clearable
               style="width: 200px"
               @keyup.enter="handleQuery"
            />
         </el-form-item>
        <el-form-item label="批次名称" prop="batchName">
          <el-input
              v-model="queryParams.batchName"
              placeholder="请输入批次名称"
              clearable
              style="width: 200px"
              @keyup.enter="handleQuery"
          />
        </el-form-item>
<!--         <el-form-item label="状态" prop="status">-->
<!--            <el-select v-model="queryParams.status" placeholder="岗位状态" clearable style="width: 200px">-->
<!--               <el-option-->
<!--                  v-for="dict in sys_normal_disable"-->
<!--                  :key="dict.value"-->
<!--                  :label="dict.label"-->
<!--                  :value="dict.value"-->
<!--               />-->
<!--            </el-select>-->
<!--         </el-form-item>-->
         <el-form-item>
            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
         </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8">
<!--         <el-col :span="1.5">-->
<!--            <el-button-->
<!--               type="warning"-->
<!--               plain-->
<!--               icon="Download"-->
<!--               @click="handleExport"-->
<!--               v-hasPermi="['system:post:export']"-->
<!--            >导出</el-button>-->
<!--         </el-col>-->
         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>

      <el-table v-loading="loading" :data="stockList">
<!--         <el-table-column type="selection" width="55" align="center" />-->
         <el-table-column label="物品名称" align="center" prop="productsName" />
         <el-table-column label="库存数量" align="center" prop="productsNum" />
        <el-table-column label="预警数量" align="center" prop="warnNum" />
<!--         <el-table-column label="状态" align="center" prop="status">-->
<!--            <template #default="scope">-->
<!--               <dict-tag :options="sys_normal_disable" :value="scope.row.status" />-->
<!--            </template>-->
<!--         </el-table-column>-->
         <el-table-column label="操作" width="180" align="center" class-name="small-padding fixed-width">
            <template #default="scope">
<!--               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:post:edit']">修改</el-button>-->
            </template>
         </el-table-column>
      </el-table>

      <pagination
         v-show="total > 0"
         :total="total"
         v-model:page="queryParams.pageNum"
         v-model:limit="queryParams.pageSize"
         @pagination="getList"
      />

      <!-- 添加或修改岗位对话框 -->

   </div>
</template>

<script setup name="Post">
import { stockNoList } from "@/api/stock/stockwarn.js";

const { proxy } = getCurrentInstance();
const stockList = ref([]);

const loading = ref(true);
const showSearch = ref(true);
const total = ref(0);
const title = ref("");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    productsName: undefined
  }
});

const { queryParams, form, rules } = toRefs(data);

/** 查询列表 */
function getList() {
  loading.value = true;
  stockNoList(queryParams.value).then(response => {
    stockList.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}
/** 取消按钮 */
function cancel() {
  open.value = false;
  reset();
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}
/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}


// /** 导出按钮操作 */
// function handleExport() {
//   proxy.download("stock/export", {
//     ...queryParams.value
//   }, `post_${new Date().getTime()}.xlsx`);
// }

getList();
</script>
